import 'dart:math';

import 'package:flutter/material.dart';

//参考：https://zhuanlan.zhihu.com/p/34190963
//https://blog.csdn.net/baidu_40389775/article/details/118094341
//https://juejin.cn/post/6844903811870359559#comment
//若 canUpdate 方法返回 true 说明不需要替换 Element，直接更新 Widget 就可以了。
//原文 ：https://medium.com/flutter/keys-what-are-they-good-for-13cb51742e7d
// void main() {
//   runApp(MyApp());
// }
//
// class MyApp extends StatelessWidget {
//   @override
//   Widget build(BuildContext context) {
//     return MaterialApp(
//       title: 'Flutter Demo',
//       theme: ThemeData(
//         primarySwatch: Colors.blue,
//       ),
//       home: MyHomePage(title: 'Flutter Demo Home Page'),
//     );
//   }
// }
//
// class MyHomePage extends StatefulWidget {
//   MyHomePage({Key? key, required this.title}) : super(key: key);
//
//   final String title;
//
//   @override
//   _MyHomePageState createState() => _MyHomePageState();
// }
//
// class _MyHomePageState extends State<MyHomePage> {
//   int _counter = 0;
//
//   void _incrementCounter() {
//     final state = (globalKey.currentState as _BoxState);
//     print(state.count);
//     final widget = (globalKey.currentWidget as Box);
//     print(widget.color);
//     //在flutter中renderObject有很多种 ，其中一种就是RenderBox
//     final renderBox =
//         (globalKey.currentContext?.findRenderObject() as RenderBox);
//     print(renderBox.size);
//     print(renderBox.localToGlobal(Offset.zero));
//     print(renderBox.localToGlobal(Offset(100, 400)));
//
//     final element = (globalKey.currentContext as Element);
//     // element.
//     setState(() {
//       _counter++;
//     });
//
//     // (context as Element).findAncestorStateOfType();
//     //MyHomePage Widget在运行时生成的对应的element
//     //findAncestorRenderObjectOfType (祖先 上级) 沿着elementTree往上找，直到找到某一种特定的类型就可以停下
//     //(这里这个类型是element,(state也是存在element之中的))
//     //沿着你现在的这个element的位置往上找，找到某一个特定的element，把它的State传回来
//     //  (context as Element).dependOnInheritedWidgetOfExactType();
//     //这个是说在我现在这个组件树的上级，找到一个离我最近的一个特定类型的Widget
//   }
//
//   GlobalKey globalKey = GlobalKey();
//
//   @override
//   Widget build(BuildContext context) {
//     // MediaQuery.of(context).size;
//     // Theme.of(context).textTheme;   //所以说 为什么Theme要of context就能找到文字啊要什么字体啊
//     // Scaffold.of(context).showSnackBar(snackbar);
//     //  print(((context as Element).findRenderObject() as RenderBox).size);
//     // return Scaffold(
//     //   appBar: AppBar(
//     //     title: Text(widget.title),
//     //   ),
//     //   body: Center(
//     //     child: Column(
//     //       mainAxisAlignment: MainAxisAlignment.center,
//     //       children: <Widget>[
//     //         // Center(child: Box(color: Colors.red,key:ValueKey(3))),
//     //         // Box(color: Colors.blue,key: ValueKey(1),),
//     //         // Box(color: Colors.yellow,key: globalKey),
//     //
//     //         // Box(color: Colors.yellow),
//     //         //
//     //         // Box(color: Colors.blue),
//     //         // Box(color:  Color(0x951ACB38)),
//     //         // Text("可以在其子组件绘制前(或后)绘制一些装饰（Decoration），如背景、边框、渐变等"),
//     //         // Center(
//     //         //   child: Box(color: Colors.red),
//     //         // ),
//     //         Box(color: Colors.blue),
//     //
//     //         Box(color:Colors.blue,key: ValueKey(1)),
//     //         Box(color:Colors.red),
//     //         Box(color: Colors.yellow),
//     //
//     //         //
//     //         // Box(color: Colors.blue,key: ValueKey(1)),
//     //         // Box(color:  Color(0x951ACB38),key: ValueKey(2)),
//     //         // Text("可以在其子组件绘制前(或后)绘制一些装饰（Decoration），如背景、边框、渐变等"),
//     //
//     //         // Center(
//     //         //   child: Box(color: Colors.red) ,
//     //         // ),
//     //
//     //         //
//     //       ],
//     //     ),
//     //   ),
//     //   floatingActionButton: FloatingActionButton(
//     //     onPressed: _incrementCounter,
//     //     tooltip: 'Increment',
//     //     child: Icon(Icons.add),
//     //   ),
//     // );
//
//     return Screen();
//   }
// }
//
// class StatelessContainer extends StatelessWidget {
//   final Color? color;
//   final String text;
//   StatelessContainer(this.color,this.text);
//
//
//   @override
//   Widget build(BuildContext context) {
//     return Container(
//       width: 100,
//       height: 100,
//       color: color,
//       child: Text(text),
//     );
//   }
// }
//
// class StatefulContainer extends StatefulWidget {
//   final Color? color;
//   final String text;
//   StatefulContainer({Key? key,this.color,required this.text}) : super(key: key);
//   @override
//   _StatefulContainerState createState() => _StatefulContainerState();
// }
//
// class _StatefulContainerState extends State<StatefulContainer> {
//
//   @override
//   Widget build(BuildContext context) {
//     print("文本：${widget.text}");
//     return Container(
//       width: 100,
//       height: 100,
//       color: widget.color,
//       child: Text(widget.text),
//     );
//   }
//
// }
//
// class Screen extends StatefulWidget {
//   @override
//   _ScreenState createState() => _ScreenState();
// }
//
// class _ScreenState extends State<Screen> {
//   List<Widget> widgets = [
//     // StatelessContainer( Color(0xFFDE1047),"文本一"),
//     // StatelessContainer( Color(0xFF99F30B),"文本一23"),
//     // StatefulContainer(color:Color(0xFFF30BD4),text:"文本safa一sfsfasaf5"),
//     // StatefulContainer(color: Color(0xFF99F30B),text:"文本一233"),
//     StatefulContainer(key: ValueKey("1"),color:Color(0xFFF30BD4),text:"文本一5 是否"),
//     StatefulContainer(key: ValueKey("2"),color: Color(0xFF99F30B),text:"文本一233"),
//
//   ];
//
//   var key = "5";
//   var text = "safaaf5";
//   @override
//   Widget build(BuildContext context) {
//     print("文本哈哈哈");
//     return Scaffold(
//       body: Center(
//         child: Row(
//           mainAxisAlignment: MainAxisAlignment.center,
//           // children:widgets,
//           children: [
//             // StatelessContainer( Color(0xFFDE1047),"文本一"),
//             // StatelessContainer( Color(0xFF99F30B),"文0本一23"),
//             // StatefulContainer(color:Color(0xFFF30BD4),text:"文本safa一sfsfasaf5"),
//             // StatefulContainer(color: Color(0xFF99F30B),text:"文本一233"),
//             // StatefulContainer(key: ValueKey(key),color:Color(0xFFF30BD4),text:text),
//             // StatefulContainer(key: ValueKey("2"),color: Color(0xFF99F30B),text:"文本一233"),
//             StatefulContainer(color:Color(0xFFF30BD4),text:text),
//             StatefulContainer(color: Color(0xFF99F30B),text:"文本一233"),
//
//           ],
//         ),
//       ),
//       floatingActionButton: FloatingActionButton(
//         onPressed: switchWidget,
//         child: Icon(Icons.undo),
//       ),
//     );
//   }
//
//   switchWidget(){
//     // widgets.insert(0, widgets.removeAt(1));
//     // key = "1";
//     text = "之值变萨芬换";
//     setState(() {});
//   }
// }
//
//
//
//
//
//
//
// ///Box
// class Box extends StatefulWidget {
//   final Color color;
//
//   const Box({Key? key, required this.color}) : super(key: key);
//
//   @override
//   _BoxState createState() => _BoxState();
// }
//
// class _BoxState extends State<Box> {
//   int count = 0;
//
//   @override
//   Widget build(BuildContext context) {
//     return InkWell(
//       onTap: () {
//         setState(() {
//           count++;
//         });
//       },
//       child: Container(
//         height: 100,
//         width: 100,
//         color: widget.color,
//         alignment: Alignment.center,
//         child: Container(
//           child: Text(
//             count.toString(),
//             style: TextStyle(fontSize: 50),
//           ),
//         ),
//       ),
//     );
//   }
// }
void main() => runApp(new MaterialApp(home: PositionedTiles()));

class PositionedTiles extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => PositionedTilesState();
}

class PositionedTilesState extends State<PositionedTiles> {
  // static get globalKey => GlobalKey<ColorfulTileState>();
  late GlobalKey globalKey;
  late List<Widget> tiles;

  // Stateful tiles now wrapped in padding (a stateless widget) to increase height
  // of widget tree and show why keys are needed at the Padding level.
  @override
  void initState() {
    super.initState();
    print("parent 更新initState");
    globalKey = GlobalKey<ColorfulTileState>();
    tiles = [
      // Padding(
      //   //1 key:UniqueKey(),
      //   //防止重建 一种是给padding设置key，一种是给它设置GlobalKey
      //   padding: const EdgeInsets.all(8.0),
      //   child: StatefulColorfulTile(key: UniqueKey(), color: Color(0xff991364)),
      //   //2 child: StatefulColorfulTile(key:GlobalKey(),text:"123"),
      // ),
      // Padding(
      //   //1 key:UniqueKey(),
      //   padding: const EdgeInsets.all(8.0),
      //   child: StatefulColorfulTile(key: UniqueKey(), color: Color(0xFF0DEA5E)),
      //   //2 child: StatefulColorfulTile(key: GlobalKey(),text:"456"),
      // ),

      //有状态的无key 直接内部传值 widget会交换 但是颜色不变  newWidget 与oldWidget 的 runtimeType 和 key 相等时会选择使用 newWidget 去更新已经存在的 Element 对象。。
      // 会走：parent build 更新和 child didUpdateWidget 和 child build 方法
      // StatefulColorfulTile(color: Color(0xff991364)),
      // StatefulColorfulTile(color: Color(0xFF0DEA5E)),

      //有状态的有key widget会交换 颜色改变  newWidget 与oldWidget 的 runtimeType 和 key 不相等时 就选择重新创建新的 Element。只会走：parent build 更新
      // StatefulColorfulTile(key: ValueKey("1"), color:Color(0xff991364)),
      // StatefulColorfulTile(key: ValueKey("2"), color:Color(0xFF0DEA5E)),

      // StatefulColorfulTile( color:Color(0xff991364)),
      // ColorLessTileState(),

      // 无状态的 widget会交换 颜色改变 parent build 更新child less build child less build
      ColorLessTileState(),
      ColorLessTileState(),

      //有状态的 直接外部传值
      // StatefulColorfulTile(color: Color(0xff991364)),
      // StatefulColorfulTile(color: Color(0xFF0DEA5E)),

      // 无状态的外部包一层
      // Padding(
      //    // key:UniqueKey(),
      //   //三种测试方式 一种是给padding设置key，一种是给它内部设置GlobalKey，，一种是给它内部设置UniqueKey（无效）
      //   padding: const EdgeInsets.all(8.0),
      //   child: StatefulColorfulTile(color: Color(0xff991364)),
      //   // child: StatefulColorfulTile(key:GlobalKey(),color: Color(0xff991364)),
      //   // child: StatefulColorfulTile(key:UniqueKey(),color: Color(0xff991364)),//UniqueKey,将会导致创建一个新元素，并初始化一个新状态
      // ),
      // Padding(
      //   // key:UniqueKey(),
      //   padding: const EdgeInsets.all(8.0),
      //   child: StatefulColorfulTile(color: Color(0xFF0DEA5E)),
      //   // child: StatefulColorfulTile(key: GlobalKey(),color: Color(0xFF0DEA5E)),
      //   // child: StatefulColorfulTile(key: UniqueKey(),color: Color(0xFF0DEA5E)),//UniqueKey
      // ),
    ];
  }

  @override
  Widget build(BuildContext context) {
    print("parent build 更新");
    return Scaffold(
      body: Column(children: tiles),
      floatingActionButton: FloatingActionButton(
          child: Icon(Icons.sentiment_very_satisfied), onPressed: swapTiles),
    );
  }

  swapTiles() {
    setState(() {
      tiles.insert(1, tiles.removeAt(0));
    });
  }

  @override
  void didUpdateWidget(covariant PositionedTiles oldWidget) {
    // TODO: implement didUpdateWidget
    super.didUpdateWidget(oldWidget);
    print("parent didUpdateWidget");
  }

  @override
  void deactivate() {
    super.deactivate();
    print("parent deactive");
  }

  @override
  void dispose() {
    super.dispose();
    print("parent dispose");
  }

  @override
  void reassemble() {
    super.reassemble();
    print("parent reassemble");
  }

  @override
  void didChangeDependencies() {
    super.didChangeDependencies();
    print("parent didChangeDependencies");
  }
}

class StatefulColorfulTile extends StatefulWidget {
  Color color;

  StatefulColorfulTile({Key? key, required this.color}) : super(key: key);

  @override
  ColorfulTileState createState() {
    print("StatefulColorfulTile 随机值createState");
    return ColorfulTileState();
  }
}

class ColorfulTileState extends State<StatefulColorfulTile> {
  late Color myColor;

  @override
  void initState() {
    super.initState();
    var random = Random().nextInt(10);
    print("child initState 随机值$random");
    if (random < 5) {
      myColor = Color(0xFF053BDE);
    } else {
      myColor = Color(0xFFEA0A0A);
    }
  }

  @override
  Widget build(BuildContext context) {
    print("child build ");
    return Container(
        //内部赋值法
        color: myColor,
        //外部传值法
        // color: widget.color,
        child: Padding(
          padding: EdgeInsets.all(70.0),
        ));
  }

  @override
  void didUpdateWidget(covariant StatefulColorfulTile oldWidget) {
    // TODO: implement didUpdateWidget
    super.didUpdateWidget(oldWidget);
    print("child didUpdateWidget");
  }

  @override
  void deactivate() {
    super.deactivate();
    print("child deactive");
  }

  @override
  void dispose() {
    super.dispose();
    print("child dispose");
  }

  @override
  void reassemble() {
    super.reassemble();
    print("child reassemble");
  }

  @override
  void didChangeDependencies() {
    super.didChangeDependencies();
    print("child didChangeDependencies");
  }
}

class ColorLessTileState extends StatelessWidget {
  getColor() {
    Color myColor;
    var random = Random().nextInt(10);
    print("child less initState 随机值$random");
    if (random < 5) {
      myColor = Color(0xFF053BDE);
    } else {
      myColor = Color(0xFFEA0A0A);
    }
    return myColor;
  }

  late Color myColor = getColor();

  @override
  Widget build(BuildContext context) {
    print("child less build ");
    return Container(
        color: myColor,
        child: Padding(
          padding: EdgeInsets.all(70.0),
        ));
  }
}
